<template>
    <div>
        <div class="operatBtnWrapper">
            <!-- <button class="operatBtn marR5" @click.stop="">导出权限</button> -->
            <button class="operatBtn marR5" @click.stop="changeUserMenu" v-if="staffNum != 'A99999'">确认修改</button>
            <button class="operatBtn marR5" @click.stop="returnBack">返回上一页</button>
            <!-- <el-select v-model="selUserId" @change="copyMenuPower" placeholder="请选择要拷贝的人员权限" class="inputTxtWrapper marR5" v-if="staffNum != 'A99999'">
                <el-option
                    v-for="item of userList"
                    :key="item.id"
                    :label="item.user_name"
                    :value="item.id">
                </el-option>
            </el-select> -->
		</div>
        <div class="grayLine"></div>

        <div class="marLR20">
            <p class="paddT20 font14">姓名：{{userName}}</p>
            <p class="paddBT20 font14">工号：{{staffNum}}</p>
            <div class="marBT20 titleBar">研发管理系统权限</div>

            <div>
                <!-- <el-tree
                    ref="tree"
                    check-strictly = "true"
                    :data="powerList"
                    default-expand-all = "true"
                    show-checkbox
                    node-key="id"
                    :default-checked-keys = 'defaultCheckedKeys'
                    :expand-on-click-node = "false"
                    :props="defaultProps">
                </el-tree> -->
                <!-- <zk-table
                    ref="table"
                    sum-text="sum"
                    index-text="#"
                    :data="data"
                    :columns="columns"
                    :stripe="props.stripe"
                    :border="props.border"
                    :show-header="props.showHeader"
                    :show-summary="props.showSummary"
                    :show-row-hover="props.showRowHover"
                    :show-index="props.showIndex"
                    :tree-type="props.treeType"
                    :is-fold="props.isFold"
                    :expand-type="props.expandType"
                    :selection-type="props.selectionType">
                    <template slot="$expand" scope="scope">
                        {{ `My name is ${scope.row.name},
                        this rowIndex is ${scope.rowIndex}.`
                        }}
                    </template>
                    <template slot="likes" scope="scope">
                        {{ scope.row.likes.join(',') }}
                    </template>
                </zk-table> -->
            </div>
        </div>

        

    </div>
</template>

<script>
import http from '@/assets/js/http'
import _g from '@/assets/js/global'
 import { mapGetters } from 'vuex'

export default {
    data(){
        return{
            selUserId:'',                                                       //..选中 的用户id
            userId:'',                                                              //..用户id
            userName:'',                                                //..姓名
            staffNum:'',                                                     //..工号

            powerList: [],                                          //  权限菜单列表
            userList:[],                                                //  所有用户
            defaultCheckedKeys:[],                          //  默认勾选的节点的 key 的数组
            defaultProps: {
                children: 'children',
                label: 'menu_name'
            }
        }
    },
    methods: {
         /* 返回上一页  */
        returnBack(){
            this.$router.push('/admin/users/list')
        },
        /* 拷贝某人权限 */
        copyMenuPower(){
            this.getMenusByUserId(this.selUserId0)
        },
        /* 获取人员权限 */
        getMenusByUserId(id){
            const that = this
            let data = {
                id
            }
            _g.showLoading('权限加载中')
            that.apiPost("admin/users/queryMenuTreeByUserId",data).then(res => {
                _g.showLoading().close()
                if(typeof res === 'string'){
                      res = JSON.parse(res)
                    }
                    if ((res.code || res.code === 0)  && res.code != 200) {
                      this.handleError(res)
                    } else if(res.data.isSuccess === 0){                                                            //  成功
                        that.powerList = res.data.tree
                        that.defaultCheckedKeys = res.data.defaultCheckedKeys
                    }else if(res.data.isSuccess === 1 || res.data.isSuccess === 2){
                        _g.toastMsg("error", res.message)
                    }
            })
        },
        /* 获取所有用户 */
        getAllUsers(){
            const that = this
            _g.showLoading('用户加载中')
            that.apiPost("admin/users/getAllUsers").then(res => {
                _g.showLoading().close()
                if(typeof res === 'string'){
                      res = JSON.parse(res)
                    }
                    if ((res.code || res.code === 0)  && res.code != 200) {
                      this.handleError(res)
                    } else if(res.data.isSuccess === 0){                                                            //  成功
                        if(res.data.userList.length <= 0){
                            _g.toastMsg("warning", '暂无用户数据')
                        }else{
                            that.userList = res.data.userList
                        }
                    }else if(res.data.isSuccess === 1){
                        _g.toastMsg("error", res.message)
                    }
            })
        },
        /* 修改权限 */
        changeUserMenu(){
            const that = this
            let data = {
                id:that.userId,
                menuIds:that.$refs.tree.getCheckedKeys(),
            }
            that.$confirm('是否确认修改权限?', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning',
                  center: true
              }).then(() => {
                    _g.showLoading('提交中')
                    that.apiPost('admin/users/changeUserMenu',data).then((res) => {
                            _g.showLoading().close()
                            if(typeof res === 'string'){
                                res = JSON.parse(res)
                            }
                            if ((res.code || res.code === 0)  && res.code != 200) {
                                that.handleError(res)
                            } else {
                            if(res.data.isSuccess === 0){             //  成功
                                _g.toastMsg("success", res.message)
                            }else{
                                _g.toastMsg("error", res.message)
                            }
                            }
                        })
                    }).catch(() => {});
        },
    },
    created () {
        this.userId = this.$route.params.userId
        this.selUserId = this.$route.params.userId
        this.userName = this.$route.params.userName
        this.staffNum = this.$route.params.staffNum
        this.getMenusByUserId(this.userId)
        this.getAllUsers()
    },
    mixins: [http]
}
</script>

<style scoped>
.titleBar{
    font-size: 14px;
    color: #ef8200;
    border: 1px dashed rgb(242,181,107);
    background-color: rgb(246,232,215);
    height: 30px;
    line-height: 30px;
    padding-left: 10px;
}
</style>


